<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<head>
    <meta charset="UTF-8">
    <title>信息添加</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" type="image/x-icon" th:href="@{/favicon.ico}"/>
    <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}">
    <link rel="stylesheet" th:href="@{/css/common.css}">
    <link rel="stylesheet" th:href="@{/css/animate.min.css}">
    <link rel="stylesheet" th:href="@{/iconfont/iconfont.css}">

    <script src="/lib/layui/layui.js"></script>
    <script src="/lib/jquery/jquery.min.js"></script>
    <script src="/js/common.js"></script>

</head>

<body>





<!--<div class="z-body animated fadeIn">-->
<form class="layui-form layui-form-pane" >
    <div class="layui-form-item">
        <label for="variable" class="layui-form-label">变量名称</label>
        <div class="layui-input-block">
            <input type="text" id="variable" name="variable"
                   lay-verify="required" lay-vertype="tips"
                   autocomplete="off" class="layui-input">
        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label">报警类型</label>
        <div class="layui-input-block">
            <select id="levels" name="levels" lay-verify="required" lay-search="" >
                <option value="1">紧急报警</option>
                <option value="2">重要报警</option>
                <option value="3">一般报警</option>
            </select>
        </div>
    </div>




    <div class="layui-form-item">
        <label for="groups" class="layui-form-label">报警组</label>
        <div class="layui-input-block">
            <input type="text" id="groups" name="groups"
                   lay-verify="required" lay-vertype="tips"
                   autocomplete="off" class="layui-input">
        </div>
    </div>
    <!--style="border:none;"-->
    <div class="layui-form-item">
        <label for="recovery" class="layui-form-label">恢复值</label>
        <div class="layui-input-block">
            <input type="text" id="recovery" name="recovery"
                   lay-verify="required" lay-vertype="tips"
                   autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label for="plimit" class="layui-form-label">限值</label>
        <div class="layui-input-block">
            <input type="text" id="plimit" name="plimit"
                   lay-verify="required" lay-vertype="tips"
                   autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label for="describes" class="layui-form-label">报警描述</label>
        <div class="layui-input-block">
            <input type="text" id="describes" name="describes"
                   lay-verify="required" lay-vertype="tips"
                   autocomplete="off" class="layui-input">
        </div>
    </div>


        <div style="margin: 0 auto; text-align: center">
            <button id="btn-add"  type="button" class="layui-btn">新增</button>
        </div>


</form>
<!--</div>-->

<script>

    // function GetRequest() {
    //     var url = decodeURI(location.search); //获取url中"?"符后的字串
    //     var theRequest = new Object();
    //     if (url.indexOf("?") != -1) {//判断url是否有参数
    //         var str = url.substr(1);
    //         strs = str.split("&");//多个参数时进行拆分
    //         for (var i = 0; i < strs.length; i++) {//按照等号进行再次拆分
    //             theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
    //         }
    //     }
    //     return theRequest;
    // }
    //
    // var Request = undefined;
    // Request = GetRequest();
    // var id = Request["id"];
    //
    //
    // $(document).ready(function () {
    //     showChakan();
    // });
    // alert(id);

    /*数据回显*/
    // $.ajax({
    //     url: "/pu/selectById?id="+id,
    //     type: "get",
    //     dataType: "json",
    //     success: function (json) {
    //         // alert(id);
    //         console.log("啦啦啦",json);
    //         $("#variable").val(json.data.variable);
    //         $("#groups").val(json.data.groups);
    //         $("#levels").val(json.data.levels);
    //         $("#recovery").val(json.data.recovery);
    //         $("#plimit").val(json.data.plimit);
    //         $("#describes").val(json.data.describes);
    //         // console.log("dddddd",json.data[0].details);
    //         // var deta = json.data[0].details;
    //         // $("#details").val(deta);
    //         // layedit.sync(json.data[0].details);
    //         // console.log("你知不知道",layedit.setContent(Content,json.data[0].details))
    //         // $("#details").text("要放入富文本的内容");   //富文本编辑
    //         // layedit.setContent(index, json.data[0].details);       //富文本编辑
    //
    //     }
    // });


    /*添加*/
    $("#btn-add").click(function () {

        var variable = $("#variable").val();
        var groups = $("#groups").val();
        var levels = $("#levels").val();
        var recovery = $("#recovery").val();
        var plimit = $("#plimit").val();
        var describes = $("#describes").val();
        // alert(variable);
        // alert(levels);
        // alert(groups);
        // alert(recovery);
        // alert(plimit);
        // alert(describes);
        $.ajax({
            url: "/pu/insertPUpdate",
            data: {"variable": variable, "groups": groups,"levels": levels,"recovery": recovery, "plimit": plimit,"describes": describes},
            type: "post",
            dataType: "json",
            success: function (json) {

                if (json.state == 2000) {
                    alert("添加成功！");
                    // location.href = "/pu/pupdate";

                } else {
                    alert(json.message);
                }
            }
        });
    });

</script>

<script>
    layui.use(['form', 'layedit', 'laydate'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;

        //日期
        laydate.render({
            elem: '#date'
        });
        laydate.render({
            elem: '#date1'
        });

        //创建一个编辑器
        var editIndex = layedit.build('LAY_demo_editor');


        //自定义验证规则
        form.verify({
            title: function(value){
                if(value.length < 5){
                    return '标题至少得5个字符啊';
                }
            }
            ,pass: [
                /^[\S]{6,12}$/
                ,'密码必须6到12位，且不能出现空格'
            ]
            ,content: function(value){
                layedit.sync(editIndex);
            }
        });

        //监听指定开关
        form.on('switch(switchTest)', function(data){
            layer.msg('开关checked：'+ (this.checked ? 'true' : 'false'), {
                offset: '6px'
            });
            layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅仅是ON|OFF', data.othis)
        });

        //监听提交
        form.on('submit(demo1)', function(data){
            layer.alert(JSON.stringify(data.field), {
                title: '最终的提交信息'
            })
            return false;
        });

        //表单赋值
        layui.$('#LAY-component-form-setval').on('click', function(){
            form.val('example', {
                "username": "贤心" // "name": "value"
                ,"password": "123456"
                ,"interest": 1
                ,"like[write]": true //复选框选中状态
                ,"close": true //开关状态
                ,"sex": "女"
                ,"desc": "我爱 layui"
            });
        });

        //表单取值
        layui.$('#LAY-component-form-getval').on('click', function(){
            var data = form.val('example');
            alert(JSON.stringify(data));
        });

    });
</script>

</body>

</html>